<template>
  <div>
    <Button type="info"
            icon="android-add-circle"
            shape="circle"
            @click="handle_result"
            :disabled="btn_disabled" style="margin-left: 15px; margin-top: 15px;">返回
    </Button>

    <job_table :column_header="column_header"
               :table_data="table_data"
               style="padding: 15px;">
    </job_table>

  </div>
</template>
<script>
  import job_table from '../utils/table_components_util'

  export default {
    data() {
      return {
        column_header: [
          {title: '定时任务说明', key: 'comment', align: 'left'},
          {
            title: '下次执行时间', key: 'next_run_time', align: 'center',
            render: (h, params) => {
              return h('div', [
                h('span', {}, params.row.next_run_time)
              ]);
            }
          },
          {
            title: '定时任务信息', key: 'job_state', align: 'center',
            render: (h, params) => {
              return h('div', [
                h('span', {}, JSON.stringify(params.row.job_state))
              ]);
            }
          },
          {title: '创建人', key: 'creator', align: 'left'},
          {title: '创建时间', key: 'create_time', align: 'left'}
        ],
        table_data: []
      }
    },
    //注册组件
    components: {
      job_table: job_table
    },
    created: function () {
      //加载表格数据
      this.loadTableData();
    },
    methods: {
      loadTableData: function () {
        this.$http.post(this.apiUrl() + "scheduler/jobgrid/", {}, {
          emulateJSON: true
        }).then((response) => {
          if (response.body.success) {
            this.table_data = response.body.grid;
          }
        });
      },
      /**
       * 返回到定时任务列表页
       */
      handle_result: function () {
        this.$emit('childClickMenu', '系统管理', '定时任务管理', 'scheduler_list');
      }
    }
  }
</script>
<style scoped>
  page_tools {
    float: right;
    padding-top: 10px;
    padding-bottom: 10px;
  }
</style>
